/*
Theme Name: AFD Folio
Theme URI: http://all-for-design.com/portfolio
Description: This is the portfolio WP theme of Aurélien Foutoyet, Web designer from France.
Version: 2.0
Author: Aurélien Foutoyet
Author URI: http://all-for-design.com/portfolio
Tags: responsive, web fonts, beige, onepage folio, textured, portfolio

AFD Folio v2.0
This theme was designed and built by Aurélien Foutoyet;
Copyrighted work, Please, don't steal my work 
*/




/*--------------------------------------------------------------------*/
/*---- AFD FOLIO MAIN STYLESHEET
/*--------------------------------------------------------------------*/


/* ------------------------------------------ LEVEL1 */
/* -------------------------- LEVEL2 */
/* -------- LEVEL3 */
/* -- LEVEL4*/



/* ------------------------------------------ GENERAL RESET BY E.MEYER */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;vertical-align: baseline;background: transparent;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}


/* ------------------------------------------ TYPOGRAPHY */

/*-------- WEB FONTS */
@font-face {
    font-family: 'Oswald';
    src: url('fonts/oswald/oswald-webfont.eot');
    src: url('fonts/oswald/oswald-webfont.eot?iefix') format('eot'),
         url('fonts/oswald/oswald-webfont.woff') format('woff'),
         url('fonts/oswald/oswald-webfont.ttf') format('truetype'),
         url('fonts/oswald/oswald-webfont.svg#webfontjPaEqqvC') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*-------- TYPE SETTING */
html{font-size:100,01%;}
body {font-family: "ff-meta-serif-web-pro-1","ff-meta-serif-web-pro-2",Georgia, serif;font-size:1em;line-height:1.4375;}

/*------ MAIN TITLE*/
#main-title a{font-family: "myriad-pro-condensed-1","myriad-pro-condensed-2", Oswald, sans-serif;font-size:2.2em;font-weight:600;letter-spacing:-0.03em;}

/*----Typekit not active or loading */
#main-title a{font-size-adjust:0.5;}

/*----Typekit active */
.wf-active #main-title a{font-size-adjust:none;}

/*------ SECTION TITLES*/
.title-section em, .social-container h3 em{font-weight:600;}
.title-section h1{font-size:2.25em;font-weight:400;letter-spacing:-0.01em;}
.title-section h1,.title-section h2{font-family: "myriad-pro-condensed-1","myriad-pro-condensed-2", Oswald, sans-serif;} 

/*----Typekit not active or loading */
.title-section h1,.title-section h2{font-size-adjust: 0.5;}

/*----Typekit active */
.wf-active .title-section em, .wf-active .social-container h3 em{font-weight:600;}
.wf-active .title-section h1,
.wf-active .title-section h2{font-size-adjust: none;font-weight:500;}


/*------ SOCIAL CONTAINER TITLE*/
.social-container h3{font-family: "myriad-pro-condensed-1","myriad-pro-condensed-2", Oswald, sans-serif;font-size: 1.625em;font-weight: 300;}

/*----Typekit not active or loading */
.social-container h3{font-size-adjust: 0.5;}

/*----Typekit active */
.wf-active .social-container h3{font-size-adjust: none;}


/*------ PORTFOLIO FILTER LINKS TITLES*/
#portfolio-filter a{font-family: "myriad-pro-condensed-1","myriad-pro-condensed-2", Oswald, sans-serif;font-size:1.875em;text-decoration:none;}

/*----Typekit not active or loading */
#portfolio-filter a{font-size-adjust: 0.5;}

/*----Typekit active */
.wf-active #portfolio-filter a{font-size-adjust:none;}


/*------ DROP CAPS*/
.lettrine {font-size: 5.15em;line-height: 0.95;}

/*----Typekit not active or loading */
.lettrine {font-size-adjust: 0.5;padding-right:0.05em;}

/*----Typekit active */
.wf-active .lettrine {font-size-adjust: none;}


/*------ PRETTY AMPERSAND */
.ampers{font-family: Baskerville, Palatino, "Book Antiqua", serif;font-style: italic;}



/* ------------------------------------------ GENERAL ELEMENTS */

body {background: url(img\\texture.gif) 0 0 repeat;color:#756359;margin:0;padding:0;}

a:link,a:visited{cursor:pointer;color:#715242;}
a:hover{color:#8E542B;}
a:active{color:#8c3c04;}
p{margin-bottom:23px;}
em{font-style:normal;}


/* -------------------------- GENERIC CLASSES */

.italic{font-style: italic;}
.small-caps{font-variant: small-caps;letter-spacing:0.05em;}
.bold{font-weight:bold;}
.highlight-color{color:#8E542B;}
.block{display:block;}
.wrap{overflow:hidden;}

.viewgrid{background: url(img\\baseline-23.png) 0 0 repeat;width:100%;height:100%}

#grid-btn{cursor:pointer;color:#715242;text-decoration: none;border-bottom:1px dotted;padding-bottom:0;}
#grid-btn:hover{cursor:pointer;color:#8E542B;text-decoration: none;border-bottom:1px solid #8E542B;padding-bottom:0;}

h1,h2,h3,h4,h5,h6{font-weight:normal;text-shadow:0 1px 1px #F5F2EB;}
.singlepage h2,.singlepage h3{color:#9f644b;}
.singlepage #projects h2 {color:#756359;}



/* -------- Special Opera browser warning */
.warning{display:none;}
.opera p.warning {display:block;position:absolute;top:200px;right:120px;width:300px;font-style:italic;font-size:14px;color:#8E542B;}

/* -------- Top button fixed */
#top-btn{position:fixed;top:200px;right:6%;width:24px;height:23px;text-indent:-9999px;}
#top-btn a{display:block;width:24px;height:23px;background:url(img\\top-btn.png) top center no-repeat;overflow:hidden;border:none;}
#top-btn a:hover{display:block;width:24px;height:23px;background:url(img\\top-btn.png) bottom center no-repeat;overflow:hidden;border:none;}



/* ------------------------------------------ HEADER */

#header{margin-bottom:22px;}

/* -------------------------- TOP BAR */
#topbar{background: url(img\\topbar-large.gif) bottom center repeat-x;width:100%;margin-bottom:28px;}
#topbar .content{max-width:940px;margin:0 auto;padding:0 3%;padding-top:13px;overflow:hidden;}

/* -------- INTRO TXT */
.intro{font-style: italic;font-size: 0.875em;width:70%;float:left;display:inline;}

/* -------- TWITTER LINK */
.twitter{width:30%;float:left;display:inline;text-align:right;}
.twitter a{background-image: url(img\\twitter-bird.gif);background-position: 0 -2px;background-repeat: no-repeat;padding-left:50px;text-decoration: none;border:none;}
.twitter a:hover{background-position:0 0;}
.twitter a span{border-bottom:1px dotted;font-size: 15px;}
.twitter a:hover span{border-bottom:1px solid;}

/* -------------------------- MAIN TITLE */
#main-title{background: url(img\\bgimg.gif) 40% top no-repeat;}
#main-title .content{background: url(img\\bg-title-3.gif) center top no-repeat;height:220px;max-width:940px;display:block;margin:0 auto;text-align:center;overflow:hidden;}
#main-title h1{margin:40px auto 11px auto;}
#main-title a {text-decoration:none;border:none;display:block;margin:0 auto;}
#main-title h2{font-style:italic;font-size:1.25em;font-weight:normal;}

/* -------------------------- NAVIGATION */
#navigation{width:80%;max-width:820px;margin:26px auto;}
#navigation .content{position:relative;z-index:1;overflow:hidden;}

#navigation ul {list-style:none;padding:11px 2% 16px 2%;margin:12px 6px;/*overflow:hidden;_zoom:1;*/text-align:center;/*-webkit-border-radius:3px;-moz-border-radius: 3px;border-radius:3px;z-index:1;background:#fffef9;-webkit-box-shadow:0 1px 7px rgba(0, 0, 0, 0.05),0 0 2px rgba(255, 255, 255, 1) inset;-moz-box-shadow:0 1px 7px rgba(0, 0, 0, 0.05),0 0 2px rgba(255, 255, 255, 1) inset;box-shadow:0 1px 7px rgba(0, 0, 0, 0.05),0 0 2px rgba(255, 255, 255, 1) inset;border:1px solid #e9e7e0;*/}
/*
#navigation ul:before,
#navigation ul:after{content:'';position:absolute;z-index:-2;width:70%;height:17%;top:55%;-webkit-box-shadow:0 6px 6px rgba(0, 0, 0, 0.8); -moz-box-shadow:0 6px 6px rgba(0, 0, 0, 0.8); box-shadow:0 6px 6px rgba(0, 0, 0, 0.8);} 

#navigation ul:before{right:auto;left: 25px; -webkit-transform:skew(-15deg) rotate(-1deg);-moz-transform:skew(-15deg) rotate(-1deg);transform:skew(-15deg) rotate(-1deg);}
#navigation ul:after{left:auto;right: 25px; -webkit-transform:skew(15deg) rotate(1deg);-moz-transform:skew(15deg) rotate(1deg);transform:skew(15deg) rotate(1deg);}
*/
#navigation li{display:inline;}

/* -------- LINKS */
#navigation a{text-transform:uppercase;/*font-size:1.65em;*/font-size:1.5em;line-height:1.5;padding:10px;border:none;/*color:#7b6e68;*/color:#725b51;text-shadow: inset 0 0 2px rgba(0,0,0,0.5), 0 1px 0 rgba(255,255,255,1);text-decoration:none;}
#navigation a:hover{color:#965439;}
#navigation a:active{color:#a63305;}

/* -------- NAV ORNAMENTS */
#navigation a:after{content:'\2767';margin:0 0 0 2%;color:#d9d7cb;font-size:0.8em;}
#navigation .contact:after{content:'';margin:0;}



/* ------------------------------------------ CONTENT */

/* -------------------------- TITLES */

/* -------- SECTION CONTAINER */
.title-section{background: url(img\\titles\\section-title-background.png) center 7px no-repeat;_background: url(img\\titles\\section-title-background.gif) center 7px no-repeat;height:100px;width:98%;margin:14px auto 31px auto;text-align:center;overflow:hidden;}

/* -------- TITLE CONTAINER */
.general-title{background: url(img\\bg-title-small.png) top center no-repeat;height:70px;width:100%;text-align:center;overflow:hidden;color:#88756a;font-size:48px;line-height:70px;font-weight:normal;padding-top:6px;margin-bottom:30px;}

/* -------- MAIN */
.title-section h1{margin:11px auto -4px auto;}
.title-section span, .social-container h3 span{color:#965439;}

/* -------- BASELINE */
.title-section h2{margin:0 auto;font-weight:300;text-transform: uppercase;letter-spacing: 0.06em;font-size:1em;}


/* ------------------------------------------ STRUCURE & LAYOUT */

/* -------------------------- CONTAINER */
.container{overflow:hidden;margin-bottom:38px;}

/* -------------------------- CONTENT 1-COL */
.container .content{max-width:960px;margin:0 auto;overflow:hidden;padding:0 3%;width:94%;}

/* -------------------------- CONTENT 2-COLS */
.two-cols{overflow:hidden;}
.two-cols .col{float:left;display:inline;margin:0 2.5% -1px 2.5%;width:45%;}

/* -------------------------- CONTENT 4-COLS */
.four-cols .col{float:left;display:inline;width:20%;margin:0 2%;}


/* ------------------------------------------ LANDING PAGE */
.theme-thumbs{padding:10px;background:#f4f3ee;border:1px solid #e3e0d8;-webkit-shadow:inset 1px 1px 1px 1px #fff;-moz-box-shadow:inset 1px 1px 1px 1px #fff;box-shadow:inset 1px 1px 1px 1px #fff;display:inline-block;margin:0 10px 22px 0;}


/* ------------------------------------------ ABOUT SECTION */

p.first:after{content:'\2767';margin:11px 0 -8px 0;color:#978e89;/*color:#b5b2ad;color:rgba(127,123,120,0.5);*/font-size:1.8em;display:block;width:100%;text-align:center;}
.photo{float:right;margin-top:-18%;}


/* ------------------------------------------ LAST PROJECTS SECTION */

/* -------------------------- PREVIEWS */
.thumb{margin:16px auto 20px auto;position:relative;z-index:1;}

/* -------- LINKS */
.thumb a{display:block;-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px;border: 1px solid #756359;border:1px solid rgba(52,54,57, 0.25);padding:10px;background:#fffef9;z-index:1;}

/* -- Shadows*/
/*.thumb a:before, .thumb a:after{ content:''; position:absolute; z-index:-2; width:60%;max-width:430px;height:10%; top:87%; left: 20px; -webkit-box-shadow:0 8px 7px rgba(0, 0, 0, 0.7); -moz-box-shadow:0 8px 7px rgba(0, 0, 0, 0.7); box-shadow:0 8px 7px rgba(0, 0, 0, 0.7); -webkit-transform:skew(-16deg) rotate(-3deg); -moz-transform:skew(-16deg) rotate(-3deg); transform:skew(-16deg) rotate(-3deg);} 
.thumb a:after{left:auto;right: 20px; -webkit-transform:skew(16deg) rotate(3deg);-moz-transform:skew(16deg) rotate(3deg);transform:skew(16deg) rotate(3deg);}
.thumb a:hover{border: 1px solid #5f5048;border:1px solid rgba(52,54,57, 0.4);-webkit-box-shadow:inset 0 0 10px rgba(52,54,57, 0.3);-moz-box-shadow:inset 0 0 10px rgba(52,54,57, 0.3);box-shadow:inset 0 0 10px rgba(52,54,57, 0.3);z-index:1;}
.thumb a:hover:before, 
.thumb a:hover:after{ -webkit-box-shadow:0 8px 7px rgba(0, 0, 0, 0.9); -moz-box-shadow:0 8px 7px rgba(0, 0, 0, 0.9); box-shadow:0 8px 7px rgba(0, 0, 0, 0.9);}
*/
/* -------- THUMBNAIL IMG */
.thumb img{max-width:100%;display:block;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}

/* -------------------------- TAGS DISPLAY */
.categories{font-size:16px;}


.categories span{padding:0 5px;}
.categories span a{font-style: italic;padding:3px;}


.categories span:nth-child(2n) {border-left:1px solid #bab9b2;border-right:1px solid #bab9b2;}
.categories span:first-child{padding-left:0;}
.categories span:last-child{padding-right:0;border-right:none;}

/* -------------------------- TITLE */
.col h2{font-size:1.313em;font-weight:bold;margin-bottom:12px;}

/* -------------------------- DESCRIPTION */
.col .descr{margin-bottom:15px;}

/* -------------------------- PROJECT LINK */
.proj-link{border-top:1px dashed  #bab9b2;padding-top:7px;}
.proj-link span{color:#9f644b;font-weight:bold;margin-right:5px;}



/* ------------------------------------------ SINGLE PAGE PROJECT THUMBNAILS */
 /* -------------------------- PREVIEWS */
.gallery .thumb a{width:22.15%;margin:3%;float:left;display:inline;}
.gallery  .thumb img{max-width:100%;display:block;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}



/* ------------------------------------------ BLOC INFORMATION */
.informations{margin:51px 0 0 0;}
.informations p{width:94%;padding:0 3%;text-align:center;font-size:1.313em;margin-bottom:12px;}
.informations em.larger{font-size:24px;font-variant:small-caps;font-weight:600;}

.ald:before{content:'\2767';margin:-23px 0 18px 0;color:#978e89;font-size:1.5em;display:block;width:100%;text-align:center;}




/* ------------------------------------------ INSPIRATION */
/* -------------------------- CONTAINER */
.library{background:url("img\\etagere.png") no-repeat bottom center transparent;background-size:100%;overflow:hidden;position:relative;width:100%;height:264px;z-index:1;}

/* -------- BOOKS */
.books{}
.books a{display:block;border:none;}
.books a:hover{display:block;border:none;}

/* -- First book*/
.books .first{position:absolute;bottom:30px;left:3.5%;}

/* -- Second book*/
.books .second{position:absolute;bottom:20px;left:15%;}


.books .first:hover, .books .second:hover{z-index:999;}


/* -------- WEBSITES LIST */
ul.websites{position:relative;bottom:-22px;left:31%;background:#f8f3f3;padding:10px;width:26%;border-top:1px solid #fff;border-left:1px solid #fff;border-right:1px solid #eee9e9;border-right:1px solid rgba(0,0,0,0.1);border-bottom:1px solid #eee9e9;border-bottom:1px solid rgba(0,0,0,0.1);}

/* -- Shadow*/
ul.websites:before, ul.articles:before{content:"";position:absolute;z-index:-2;width:100%;right:50px;bottom:-1px;height:8%;-webkit-box-shadow:60px 0 4px rgba(0, 0, 0, 0.4);-moz-box-shadow:60px 0 4px rgba(0, 0, 0, 0.4);box-shadow:60px 0 4px rgba(0, 0, 0, 0.4);-webkit-transform:skew(-40deg);-moz-transform:skew(-40deg);-o-transform:skew(-40deg);transform:skew(-40deg);}

/* -- list item*/
ul.websites li{background-color:#ecebe6;height:42px;line-height:42px;overflow:hidden;border-bottom:1px solid #d6d1ca;border-top:1px solid #fff;}
ul.websites li:first-of-type, .articles li:first-of-type{border-top:none;}
ul.websites li:last-of-type, .articles li:last-of-type{border-bottom:none;}
ul.websites li a, .articles li a{text-decoration:none;display:block;}
.articles li a{padding-left:10px;}
ul.websites li a:hover, .articles li a:hover{text-decoration:none;display:block;background-color:#f4f3ef;}
ul.websites li a:hover{color:#9f644b;}

ul.websites li a {background-image: url("img\\sprites-icons.gif");background-repeat:no-repeat;padding-left:40px;}
#ilt {background-position: 0 -7px;}
#dribbble {background-position: 0 -101px;}
#tw {background-position: 0 -196px;}
#ng {background-position: 0 -290px;}

/* -------- ARTICLES LIST */

ul.articles {position:relative;top:-156px;left:61%;background:#f8f3f3;padding:10px;width:31%;border-top:1px solid #fff;border-left:1px solid #fff;border-right:1px solid #eee9e9;border-right:1px solid rgba(0,0,0,0.1);border-bottom:1px solid #eee9e9;border-bottom:1px solid rgba(0,0,0,0.1);}
.articles li{background:#ecebe6;overflow:hidden;border-bottom:1px solid #d6d1ca;border-top:1px solid #fff;}
.articles .website-name{font-variant:small-caps;color:#9f644b;display:block;}
.articles .article-name{display:block;}
.articles li a:hover span.article-name{color:#9f644b;font-style:italic;letter-spacing: 0.035em;}
.websites li a img{margin-right:10px;}
.articles a {border:none;padding:0.5em;}




/* ------------------------------------------ CONTACT FORM */
/* -------------------------- STRUCTURE */
#contact-form{margin-top:-5px;}
#contact-form fieldset{margin:0;padding:0;border:none;}
/* -------------------------- PARAGRAPHS */
#contact-form p{padding-bottom:22px;margin-bottom:11px;border-bottom:1px dashed #cecbc3;overflow:hidden;}
#contact-form  p.textmess{border:none;}
/* -------------------------- LABELS */
#contact-form form label{display:block;padding:4px 0 0 0;font-style:italic;}

/* -------------------------- SEND BTN */
/* -------- Containers */
#contact-form  .info-validation{float:left;display:inline;width:100%;margin-top:-22px;padding:0;overflow:hidden;}
#contact-form  p.submition{display:block;width:100%;text-align:left;border:none;margin:0;padding:0;}
/* -------- Normal */
#contact-form p .button,
#contact-form form input[type="submit"] {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;background:#f7f6f2;border:1px solid #c0bdaf;text-align:center;cursor:pointer;padding:5px;font-variant:small-caps;letter-spacing: 0.045em;font-size:1.125em;color:#88756a;width:25%;}
/* -------- Hover */
#contact-form p .button:hover,
#contact-form form input[type="submit"]:hover {background:#f0eee8;border:1px solid #a9a29e;}

/* -------------------------- FIELDS */

/* -------- Normal */
#contact-form form input[type="text"], 
#contact-form form textarea, 
#contact-form form select {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;background:#f7f6f2;border:1px solid #c0bdaf;padding:8px 0 8px 10px;width:96%;margin:0;color:#88756a;font-size:16px;}

/* -------- Hover */
#contact-form form input:hover[type="text"], 
#contact-form form textarea:hover, 
#contact-form form select:hover,
#contact-form form .button:hover {border:1px solid #bab9b2;background:#faf9f6;}

/* -------- Active */
#contact-form form input:active[type="text"], 
#contact-form form textarea:active, 
#contact-form form select:active,
#contact-form form .button:active {border:1px solid #bab9b2;background:#faf9f6;}

/* -------- Focus */
#contact-form form input:focus[type="text"], 
#contact-form form textarea:focus, 
#contact-form form select:focus,
#contact-form form .button:focus {border:1px solid #bab9b2;background:#faf9f6;}

/* -------------------------- CONTACT FORM PLUGIN : ERROR MSG */

/* -------- Error message under each field */
.wpcf7-not-valid-tip-no-ajax{color:#9f644b;margin-top:5px;font-style:italic;font-size:13px;width:100%;float: left;text-align:center;}

/* -------- Response message container at the end of the form*/
.wpcf7-display-none{display:none;}
.wpcf7-response-output{font-variant: small-caps;margin-top:22px;padding:11px;text-align:center;}
/* -- Error message*/
.wpcf7-validation-errors{border:1px dashed #9f644b;color:#9f644b;}
/* -- Confirmation message*/
.wpcf7-mail-sent-ok{border:1px dashed #667c32;color:#667c32;}



/* ------------------------------------------ SOCIAL NETWORK AND PLANNING */

/* -------------------------- CONTAINER WITH SHADOWS */
.shadow-right{background:url(img\\shadow-calendar.png) 14px 109px no-repeat;width:100%;height:550px;}

/* -------------------------- CONTAINER WITH "PLI" */
.topsection{overflow:hidden;background:url(img\\pli.gif) center 160% repeat-x;padding-bottom:45px;width:100%;display:block;}

/* -------------------------- CALENDAR */
.calendar{background: url(img\\agraf.gif) no-repeat center 6px #f5f3eF;width:100%;padding-top:5px;float:right;display:inline;-webkit-shadow:0 0 5px rgba(136,117,106,0.3);-moz-box-shadow:0 0 5px rgba(136,117,106,0.3);box-shadow:0 0 5px rgba(136,117,106,0.3);}

/* -------- Title */
.left-col .title{margin-top:20px;}

/* -------- Columns display */
.calendar .left-col{float:left;display:inline;width:30%;padding-left:5%;}
.calendar .right-col{float:left;display:inline;width:59%;padding:5px 1% 0 0;}

/* -------- Table display */
.calendar table {width:100%;}
.calendar table th.first{width:30%;}
.calendar table th{width:17.5%;font-size:0.875em;}
.calendar table td.month-name{width:25%;font-size:0.875em;font-style:italic;text-align:right;padding-right:5%; }


/* -------- FULL / AVAILABLE COLOR BLOC */
.full{background:url(img\\color-red-full.gif) left 13px repeat-x;height:20px;line-height:20px;text-indent:-9999px;font-size:0;width:95%;float:left;display:inline;}
.ready{background:url(img\\color-green-ready.gif) left 13px repeat-x;height:20px;line-height:20px;text-indent:-9999px;font-size:0;width:95%;float:left;display:inline;}

/* -------- Title */
.calendar .title{margin:28px 0 18px 0;font-variant: small-caps;}
.calendar .small{font-size:1em}
.calendar .large{font-size:1.131em;}

/* -------- Legend */
.legend td {vertical-align: baseline;}
.legend td.first {width:30%}
.calendar .legend{padding-top:8px;border-top:1px dashed #cecbc3;width:100%;}
.available-legend {padding-left:5%;font-size:0.875em;font-style:italic;width:70%;}
.full-legend .full{display:inline-block;width:20px;height:7px;background-color:#e56600;margin-right:5px;}



/* -------------------------- SOCIAL ICONS */

/* -------- Container */
.social-container{background:#f5f3ef;width:100%;float:right;display:inline;}

/* -------- Title */

.social-container h3{text-align:center;margin:2px auto 12px auto;display:block;padding:0 5%;}

/* -------- List */
.social-container ul{list-style: none;overflow:hidden;width:100%;}
.social-container li{display:inline;float:left;width:49.8%;border-top:1px dashed #bab9b2;}
.social-container li:hover{background:#edeae4;}
.social-container li:nth-child(2n){border-left:1px dashed #bab9b2;}
.social-container li:nth-last-of-type(-n+2){border-bottom:1px dashed #bab9b2;}

/* -------- List links */
.social-container li a span.thum{background-image:url(img\\social-icons-4.png);background-repeat:no-repeat;display:inline-block;text-indent:-9999px;font-size:0;width:30px;height:30px;margin :0 5px 0 10px;overflow:hidden;float:left;}
.social-container li a span.txt{display:inline-block;height:30px;line-height: 30px;overflow:hidden;text-shadow: 0 1px 0 #fff;float:left;}
.social-container li:hover a span.txt{color:#9f644b;}
.social-container li a{font-style: italic;padding:10px 0;text-decoration:none;border:none;width:100%;height:100%;float:left;border:none;}
.social-container li a:hover{color:#8E542B;}

/* -------- Icons */
.social-container .twit{background-position: -32px 0;}
.social-container li:hover .twit{background-position: -32px -33px;}

.social-container .behance{background-position: -125px 0;}
.social-container li:hover .behance{background-position: -125px -33px;}

.social-container .afd{background-position: -187px 0;}
.social-container li:hover .afd{background-position: -187px -33px;}

.social-container .su{background-position: -63px 0;}
.social-container li:hover .su{background-position: -63px -33px;}

.social-container .typographe{background-position: -218px 0;}
.social-container li:hover .typographe{background-position: -218px -33px;}

.social-container .flickr{background-position: -156px 0;}
.social-container li:hover .flickr{background-position: -156px -33px;}

.social-container .bbb{background-position: -1px 0;}
.social-container li:hover .bbb{background-position: -1px -33px;}

.social-container .skype{background-position: -94px 0;}
.social-container li:hover .skype{background-position: -94px -33px;}

.social-container .zo{background-position: -249px 0;}
.social-container li:hover .zo{background-position: -249px -33px;}

.social-container .go{background-position: -280px 0;}
.social-container li:hover .go{background-position: -280px -33px;}

.social-container .fo{background-position: -311px 0;}
.social-container li:hover .fo{background-position: -311px -33px;}

.social-container .gplus{background-position: -342px 0;}
.social-container li:hover .gplus{background-position: -342px -33px;}


/* ------------------------------------------ CATEGORY TEMPLATE PAGE */

/* ------------------------------------------ Menu list */
.submenu{width:100%;margin:11px auto 22px auto;overflow:hidden;overflow:hidden;float:left;display:inline;}
.submenu p{float:left;display:inline;width:20.5%;padding:0;overflow:hidden;text-align:right;font-size:18px;margin:10px 2.8% 0 0;}

#portfolio-filter {width:74.05%;float:left;display:inline;overflow:hidden;text-align:right;}
#portfolio-filter li{display:inline;text-align:center;}
#portfolio-filter a{cursor:pointer;margin:0 0 0 3%;text-transform:uppercase;border:none;}
#portfolio-filter a:after{content:'\2767';margin:0 0 0 3%;color:#d9d7cb;font-size:1em;border:none;}
#portfolio-filter li:last-child a:after{display:none;}


#portfolio-list{overflow:hidden;clear:left;padding:0 0 0 15px;}

#portfolio-list li{float:left;display:inline;overflow:hidden;width:22.15%;margin:0 2.8% 22px 0;}
#portfolio-list li img{max-width:100%;}


/* ------------------------------------------ Content item (li)*/
#portfolio-list h2{font-size:18px;background:none;padding-bottom:2px;}



/* ------------------------------------------ SINGLE POST PAGE : PROJECT DETAILS */

/* ------------------------------------------ Top bar : title - navigation */
/* -------------------------- Container */
.toptitlebar{max-width:960px;width:100%;margin:8px auto 26px auto;overflow:hidden;padding-bottom:15px;border-bottom:1px solid #dcdad7;border-bottom:1px solid rgba(0,0,0,0.1);-webkit-box-shadow: inset 0 -1px 0 rgba(255,255,255,0.6);-moz-box-shadow: inset 0 -1px 0 rgba(255,255,255,0.6);box-shadow: inset 0 -1px 0 rgba(255,255,255,0.6);}

/* -------------------------- Title */
.toptitlebar h2{width:44%;margin:0 2.5%;float:left;display:inline;font-size:30px;}

/* -------------------------- Links container */
.toptitlebar .projects-nav{width:48%;margin:13px 0 0 0;float:left;display:inline;overflow:hidden;text-align:right;}
/* -------- Links */
.toptitlebar p.projects-nav a{padding-bottom:0;}
.toptitlebar p.projects-nav a:hover{padding-bottom:0;}
.toptitlebar p.projects-nav a:first-child{margin-right:20%;text-transform: uppercase;}
.toptitlebar p.projects-nav a:nth-child(2n){margin-right:25px;}
.toptitlebar p.projects-nav a:last-child{margin-right:0;}
/* -------- Next / Prev proj links */
.toptitlebar .projects-nav .next-proj{float:right;display:inline;}
.toptitlebar .projects-nav .prev-proj{float:left;display:inline;}



/* ------------------------------------------ Column display */
.singlepage .col  {overflow:hidden;}
.singlepage .col  h3{width:100%;font-size:24px;margin:0 auto 22px auto;border-bottom:1px dashed;padding-bottom:3px;}

/* ------------------------------------------ Project information bloc */
.proj-general-info{background:rgba(255,255,255,0.2);-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;overflow:hidden;padding:28px 5%;border:1px dashed #C7B5A9;-webkit-shadow:inset 1px 1px 0 #ffffee;-moz-box-shadow:inset 1px 1px 0 #ffffee;box-shadow:inset 1px 1px 0 #ffffee;}

/* ------------------------------------------ Project information bloc for Internet Explorer */
.ie .proj-general-info{background:#f9f9f8;overflow:hidden;padding:28px 22px;border:1px dashed #C7B5A9;}

/* -------------------------- Container */
.proj-general-info div{overflow:hidden;border-bottom:1px dashed #d4d3cf;margin-bottom:16px;padding-bottom:5px;}
.proj-general-info div:last-of-type{border:none;margin-bottom:0;}

/* -------------------------- Label */
.proj-general-info .label{width:21%;float:left;display:inline;margin:0 2% 0 0;font-style:italic;font-size:15px;opacity:0.9;}
.proj-general-info .label img{margin-right:10px;}

/* -------------------------- Values */
.proj-general-info .value{width:74%;float:left;display:inline;margin:0 0 0 2%;}


/* ------------------------------------------ DESCRIPTION TEXT */

.singlepage .project-description{margin-top:31px;overflow:hidden;}

/* -------------------------- Lists display in project description */
.long-descr ul{margin-bottom:22px;overflow:hidden;}
.postid-21 .long-descr ul{margin-bottom:33px;}
.proj-general-info li, .long-descr li{margin-bottom:11px;background:url(img\\bullet-1.gif) left center no-repeat;padding-left:20px;}
.proj-general-info li:hover, .long-descr li:hover{margin-bottom:11px;background:url(img\\bullet-1-hover.gif) left center no-repeat;padding-left:20px;margin-bottom:11px;}

/* -------------------------- Screenshot browser preview */
.browser-preview{/*max-width:460px;*/width:100%;}
.browser-preview img{max-width:100%;}

/* -------------------------- Description text titles */
.singlepage  h3.info{width:100%;font-size:24px;margin:0 auto 31px auto;}
.singlepage  h3.about{width:100%;font-size:24px;margin:0 auto 16px auto;}
.singlepage  h3.gallery{width:100%;font-size:24px;margin:0 auto 16px auto;}

/* -------------------------- Description text h4 titles */
.long-descr h4{font-size:18px;font-weight:bold;margin-bottom:22px;}

/* -------------------------- Information bloc */
.long-descr .info{font-style:italic;border:1px dotted #667c32;color:#667c32;padding:10px;}
.long-descr .info a:link,.long-descr .info a:visited{color:#667C32;}
.long-descr .info a:hover{color:#546e15;}
.long-descr .info a:active{color:#667C32;}

.singlepage .gallery{overflow:hidden;}


/* ------------------------------------------ ARCHIVE PAGE */

/* -------------------------- Searched term */
.archive-word{background:url(img\\bg-quote.gif) left center no-repeat;display:block;font-size:60px;line-height:85px;margin:22px 0 24px 10px;letter-spacing:-0.01em;}
.archive-word:first-letter{color:#9f644b;}
.separate-grunge-bg{background:url(img\\grunge-border.gif) center right repeat-y;}

/* -------------------------- Column display */
.leftcol-archive, .rightcol-archive{float:left;display:inline;width:47%;margin:0 1%;}
.leftcol-archive p{padding-left:10%;}

/* -------------------------- project list display */
.archive-results #portfolio-list li{float:left;display:inline;overflow:hidden;width:22.15%;margin:0 2.8% 22px 0;}
.archive-results #portfolio-list li img{max-width:100%;}
.archive-results #portfolio-list li:nth-child(4n){margin-right:0;}

/* -------------------------- Info : nb of projects etc. */
.informations-archive{background:url("img\\ornament-bg.gif") center 5px no-repeat transparent;padding-top:43px;margin-top:22px;overflow:hidden;margin-bottom:1px;}
.informations-archive p{width:100%;text-align:center;font-size:20px;}

/* -------------------------- Navigation */
.navigation{margin:1em 1%;}
.navigation a{padding:5px 10px;border-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;text-decoration:none;-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.95), inset 0 0 1px rgba(255,255,255,0.9);-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.95), inset 0 0 1px rgba(255,255,255,0.9);box-shadow: 0 1px 0 rgba(255,255,255,0.95), inset 0 0 1px rgba(255,255,255,0.9);text-align:center;}
.navigation a:link,.navigation a:visited {background-color: rgba(255, 255, 255, 0.4);}
.navigation a:hover {background-color: rgba(255, 255, 255, 0.9);}
.navigation a:visited {background-color: rgba(255, 255, 255, 0.4);}

/* ------------------------------------------ FOOTER */

#footer{margin-bottom:0;}
#bottom-bar{background: url(img\\bottombar-large.gif) center top repeat-x;width:100%;margin-bottom:0;}
#bottom-bar .content{max-width:940px;margin:0 auto;padding:26px 10px 14px 10px;text-align:center;}
#bottom-bar p{margin-bottom:0;}




/* ------------------------------------------ CLEAR FLOATED ELEMENTS */

/* http://sonspring.com/journal/clearing-floats */
html body * span.clear,
html body * div.clear,
html body * li.clear,
html body * dd.clear{background:none;border:0;clear: both;display: block;float:none;font-size:0;list-style:none;margin:0;padding:0;overflow: hidden;visibility: hidden;width:0;height:0;}

/* http://www.positioniseverything.net/easyclearing.html */
.clearfix:after{clear: both;	content: '.';	display: block;	visibility: hidden;	height: 0;}
.clearfix{display:inline-block;}
.clearfix{display: block;}


/* ------------------------------------------ LETTRINES */

.lettrine{float:left;text-align:center;margin-bottom:-5px;width:60px;height:71px;}

.l-a{background:url("img\\lettrines\\a.gif") no-repeat 0 5px transparent;}
.l-b{background:url("img\\lettrines\\b.gif") no-repeat 0 0 transparent;}
.l-c{background:url("img\\lettrines\\c.gif") no-repeat 8px 6px transparent;}
.l-d{background:url("img\\lettrines\\d.gif") no-repeat 0 0 transparent;}
.l-e{background:url("img\\lettrines\\e.gif") no-repeat 0 5px transparent;}
.l-f{background:url("img\\lettrines\\f.gif") no-repeat 3px 0 transparent;}
.l-g{background:url("img\\lettrines\\g.gif") no-repeat 0 0 transparent;}
.l-h{background:url("img\\lettrines\\h.gif") no-repeat 0 0 transparent;}
.l-i{background:url("img\\lettrines\\i.gif") no-repeat 0 0 transparent;width:44px;}
.l-j{background:url("img\\lettrines\\j.gif") no-repeat 9px 0 transparent;}
.l-k{background:url("img\\lettrines\\k.gif") no-repeat 0 5px transparent;} 
.l-l{background:url("img\\lettrines\\l.gif") no-repeat 0 8px transparent;}
.l-m{background:url("img\\lettrines\\m.gif") no-repeat -10px 0 transparent;}
.l-n{background:url("img\\lettrines\\n.gif") no-repeat 0 4px transparent;}
.l-o{background:url("img\\lettrines\\o.gif") no-repeat -1px 7px transparent;}
.l-p{background:url("img\\lettrines\\p.gif") no-repeat 0 0 transparent;}
.l-q{background:url("img\\lettrines\\q.gif") no-repeat -1px 3px transparent;}
.l-r{background:url("img\\lettrines\\r.gif") no-repeat 0 0 transparent;}
.l-s{background:url("img\\lettrines\\s.gif") no-repeat 5px 5px transparent;}
.l-t{background:url("img\\lettrines\\t.gif") no-repeat 5px 5px transparent;}
.l-u{background:url("img\\lettrines\\u.gif") no-repeat 4px 5px transparent;}
.l-v{background:url("img\\lettrines\\v.gif") no-repeat 0 -1px transparent;}
.l-w{background:url("img\\lettrines\\w.gif") no-repeat 0 0 transparent;}
.l-x{background:url("img\\lettrines\\x.gif") no-repeat 0 0 transparent;}
.l-y{background:url("img\\lettrines\\y.gif") no-repeat 0 0 transparent;}
.l-z{background:url("img\\lettrines\\z.gif") no-repeat 0 0 transparent;}


/* ------------------------------------------ MEDIA QUERIES STYLES */

/* Disable iOS/WinMobile font size changes */
/**/
@media screen and (max-width: 600px),
screen and (max-device-width: 480px) {
    html {
        -ms-text-size-adjust: none;
        -webkit-text-size-adjust: none;
    }
}

/* -------------------------- 800px screen width*/
@media screen and (max-width: 800px) {
  *{-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;transition: all 1s ease-in-out;}
	.social-container .thum{-webkit-transition: none;-moz-transition: none;-o-transition: none;transition: none;}
  
  .intro{font-size:0.813em;}
  #navigation{width:98%;}
  #aboutcontainer .two-cols .col {display: block;float: none; margin: 0 2.5%; width: 95%;}
  .photo{margin:-20% 4% 0 0;}
  ul.articles{top:-174px;}
   
  .archive-results #portfolio-list li, #portfolio-list li {display: inline;float: left;margin: 0 3.8% 22px 0;overflow: hidden;width: 48.1%;}
  .archive-results #portfolio-list li:nth-child(2n), #portfolio-list li:nth-child(2n){margin-right:0;}
  

  .submenu{margin-top:0;}
  .submenu p{float:none;display:block;width:100%;margin:0 0 15px 0;padding:0 0 0 3%;text-align:left;}

	#portfolio-filter {width:100%;float:none;display:block;overflow:hidden;}
		
	.singlepage .col  {width:100%;display:block;margin:0;float:none;}
	.singlepage .gallery {border-bottom:1px dashed;margin-bottom:30px;padding-bottom:10px;}
	
	.calendar .left-col {display: inline;float: left;padding:2%; width: 98%;margin-bottom:5px;}
	.calendar .left-col .title{width:40%;float:left;padding:5px 4% 0 4%;margin:0;border-right:1px dashed;}
	.calendar .left-col .title span, .calendar .large{font-size:100%;}
	.calendar .left-col .legend{width:40%;float:left;padding:25px 4% 0 4%;margin:0;border-top:0;}
	.calendar .right-col {display: inline;float: left;padding:4% 2%;width: 98%;border-top:1px dashed;border-bottom:1px dashed;}
	.calendar table {width: 90%;}
	.calendar table th.first {width: 20%;}
  .social-container li {border-top: 1px dashed #BAB9B2;display: block;width: 100%;}
  .social-container li:nth-child(2n) {border-left: none;}
  .topsection {padding-bottom: 16px;}
}


/* -------------------------- 640px screen width*/
@media screen and (max-width: 640px) {
	
	*{-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;transition: all 1s ease-in-out;}
	.social-container .thum{-webkit-transition: none;-moz-transition: none;-o-transition: none;transition: none;}
  
	.twitter a{background: none;padding:0;}

  #navigation a{font-size:1.4em;padding:5px;}
  #navigation a:after{display:none;}
  .photo{margin:-20% 4% 0 0;}
  ul.articles{top:-174px;}
  
	.library{background:none;overflow:visible;position: static;width:96%;padding:0;height:auto;}
	.books{text-align: center;}
	.books a, .books a:hover{display:inline;border:none;}
	.books .first{margin:14px 10px 0 0;}
	.books .first, .books .second{position:static;float: none;}
	ul.websites{position:static;width:96%;margin:10px 0;}	
	ul.websites:before, ul.articles:before{display:none;}
	ul.websites li{height:auto;}
	ul.websites li a{border:none;}
	ul.articles {position:static;width:96%;}
	
	#contact-form form input[type="text"], 
	#contact-form form textarea, 
	#contact-form form select {width:94%;}
	#contact-form p .button,#contact-form form input[type="submit"]{width:98%;margin:10px 0;}
	
	
	.leftcol-archive, .rightcol-archive {float: none;margin: 0;width: 100%;}
	.leftcol-archive p{padding:0;}
	.archive-word {background-size:50%;display: inline;font-size: 1.688em;letter-spacing: 0;margin: 0 1%;line-height: inherit;}
	
	#portfolio-filter li:first-child a {margin-left:0;}
	#portfolio-filter {padding: 0 3%;}
}



/* -------------------------- 436px screen width*/
@media screen and (max-width: 436px) {

	*{-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;transition: all 1s ease-in-out;}
	.social-container .thum{-webkit-transition: none;-moz-transition: none;-o-transition: none;transition: none;}
	
	body {font-family: Georgia, serif;}

	#main-title{background: none;}
	#main-title h1{margin:1.25em auto 0.2em auto;}
	#main-title h2{line-height:1.2}
	
  #navigation a{font-size:1.45em;padding:5px;}
  #navigation ul:before,#navigation ul:after{ top:65%;} 
  
  #aboutcontainer span.block{display:inline;}
  
  .informations a,
  #contact-form form input[type="submit"]{display:block;padding:5px 10px;border-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;text-decoration:none;-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.95), inset 0 0 1px rgba(255,255,255,0.9);-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.95), inset 0 0 1px rgba(255,255,255,0.9);box-shadow: 0 1px 0 rgba(255,255,255,0.95), inset 0 0 1px rgba(255,255,255,0.9);border:1px solid rgba(0,0,0,0.1);text-align:center;margin-top:0.5em;}
	.informations a:link,
	.informations a:visited,
	 #contact-form form input[type="submit"]{background-color: rgba(255, 255, 255, 0.4);}
	.informations a:hover,
	.informations a:focus,
	#contact-form form input[type="submit"]:hover {background-color: rgba(255, 255, 255, 0.9);}
	.informations a:active {background-color: rgba(255, 255, 255, 0.4);}
  
  .photo{margin:2% 4% 0 0;}
  ul.articles{top:-174px;}
  .two-cols .col {display: block;float: none;margin: 0 2.5%; max-width: 940px;width: 95%;}
  
  .shadow-right {margin-top:20px;}
  
  #portfolio-filter {width:100%;padding:0;}
  #portfolio-filter li {display: block;margin-bottom:10px;}
  #portfolio-filter li:first-child a {margin:5px;}
  #portfolio-filter li a {margin:5px;display: block;background:#faf9f7;background:rgba(255,255,255,0.7);border:1px solid rgba(0,0,0,0.1);border-webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px;-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.5), inset 0 1px 1px rgba(255,255,255,0.5);-moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.5), inset 0 1px 1px rgba(255,255,255,0.5);box-shadow: 1px 1px 1px rgba(0,0,0,0.5), inset 0 1px 1px rgba(255,255,255,0.5);}
  #portfolio-filter li a:hover,#portfolio-filter li a:active {margin:5px;display: block;background:rgba(0,0,0,0.1);}
  #portfolio-filter a:after {display:none;}
	
	.toptitlebar h2 {display: block;float: none;font-size: 30px;margin: 0;width: 100%;}
	.toptitlebar .projects-nav {display: block;float: none;margin: 1em 0 0;text-align: left;width: 100%;}
	.toptitlebar p.projects-nav a:first-child {display:block;margin:1em 0;}
	
	.proj-general-info .label { width: 33%;}
	.proj-general-info .value { width: 63%;}
	
	
	.archive-word {background-size:inherit;display: block;font-size: 2.8em;letter-spacing: 0;margin: 0.3em 1%;line-height: inherit;}

	.archive-results #portfolio-list li, #portfolio-list li {display: block;float: none;margin: 0 4%;overflow: hidden;width: 90%;}
  .archive-results #portfolio-list li:nth-child(2n), #portfolio-list li:nth-child(2n), .archive-results #portfolio-list li:nth-child(4n){margin: 0 4%;}
  
  .navigation a {display:block;margin:2em 0 0 0;}
  .toptitlebar h2 {display: block;float: none;margin: 0 0 10px 0;width: 100%;}
  .toptitlebar .projects-nav {display: block;float: none;margin: 0 0 10px 0;width: 100%;text-align:left;}
  .toptitlebar p.projects-nav a {padding:5px;}
  
  
}